// 这里只是说明了@reduxjs/toolkit如何使用,此时与react无关
// 创建slice. 因为创建store对象,需要slice
import { createSlice, configureStore } from '@reduxjs/toolkit'

const countSlice = createSlice({
  name: 'xxx', // slice的名称. 未来在action对象中可以看到
  initialState: { count: 0, msg: '嘿嘿嘿' }, //初始化数据
  // 这个配置项,既可以生成reducer函数,也可以生成actionCreator
  reducers: {
    // 这个函数名,即使reducer中的case. 也是actionCreator的名字
    add(state, action) {
      // 注意: 这个state其实不是真正的redux的state数据,是真正的state数据的代理.这个代理可以直接被修改. 然后代理修改后的数据,去修改redux的数据
      console.log(state, action)
      state.count = state.count + action.payload
    },
  },
})
console.log(store.getState())
// 创建store对象
const store = configureStore({
  // 相当于合并reducer
  reducer: {
    count: countSlice.reducer,
  },
})
// 解构actionCreator
const { add } = countSlice.actions
console.log(add(1))
console.log(store.getState())
store.dispatch(add(1))
console.log(store.getState())
